import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

import 'wechat_nav_bar.dart';

class WechatIndex extends StatefulWidget {
  WechatIndex({Key key}) : super(key: key);

  @override
  _WechatIndexState createState() => _WechatIndexState();
}

class _WechatIndexState extends State<WechatIndex> {
  int currentIdx = 0;

  var barTitles = [
    WechatNavBar(icon: Icons.brightness_1, label: '微信'),
    WechatNavBar(icon: Icons.contact_phone, label: '通讯录'),
    WechatNavBar(icon: Icons.find_in_page, label: '发现'),
    WechatNavBar(icon: Icons.person_outline, label: '我')
  ];

  var itemOptions = [
    WechatNavBar(icon: Icons.brightness_1, label: '发起群聊', value: 'group'),
    WechatNavBar(icon: Icons.person_add, label: '添加朋友', value: 'friend'),
    WechatNavBar(icon: Icons.settings_cell, label: '扫一扫', value: 'scan'),
    WechatNavBar(icon: Icons.attach_money, label: '收付款', value: 'money'),
    WechatNavBar(icon: Icons.live_help, label: '帮助与反馈', value: 'help'),
  ];

  /*底部导航栏点击事件*/
  void tabBarChange(idx) {
    setState(() {
      currentIdx = idx;
    });
  }

  /*获取顶部加号按钮下拉菜单*/
  List<PopupMenuItem<String>> getMenuItems() {
    List<PopupMenuItem<String>> items = [];
    itemOptions.forEach((option) {
      items.add(PopupMenuItem<String>(
        child: Row(
          children: <Widget>[
            Icon(
              option.icon,
              color: Colors.white,
            ),
            Container(
              child: Text(
                option.label,
                style: TextStyle(color: Colors.white),
              ),
              margin: EdgeInsets.only(left: 10),
            )
          ],
        ),
        value: option.value,
      ));
    });
    return items;
  }

  /*获取底部导航栏*/
  BottomNavigationBar getNavBars() {
    var bottomNavigationBarItems = List<BottomNavigationBarItem>();
    barTitles.forEach((WechatNavBar bar) {
      bottomNavigationBarItems.add(BottomNavigationBarItem(
          icon: Icon(
            bar.icon,
//          color: Colors.blue,
//          size: 20,
          ),
          title: Container(
            margin: EdgeInsets.only(top: 4),
            child: Text(bar.label),
          )));
    });
    return BottomNavigationBar(
      currentIndex: currentIdx,
      type: BottomNavigationBarType.fixed,
      iconSize: 20,
      fixedColor: Colors.red,
      unselectedItemColor: Colors.blue,
      selectedFontSize: 14,
      items: bottomNavigationBarItems,
      onTap: tabBarChange,
    );
  }

  @override
  Widget build(BuildContext context) {
    var text = barTitles[currentIdx].label;
    return Scaffold(
        appBar: AppBar(
          title: Text(text),
          actions: <Widget>[
            Container(
              child: Icon(Icons.search),
              padding: const EdgeInsets.only(right: 10),
            ),
            PopupMenuButton(
              icon: Icon(Icons.add_circle_outline),
              tooltip: "长按提示",
              padding: EdgeInsets.all(0.0),
              offset: Offset(0, 120),
              color: Color.fromRGBO(0, 0, 0, 0.6),
              itemBuilder: (BuildContext context) {
                return getMenuItems();
              },
              onSelected: (String action) {
                print(action);
              },
              onCanceled: () {
                print("onCanceled");
              },
            ),
          ],
        ),
        body: SingleChildScrollView(
          padding: EdgeInsets.all(20),
          child: Center(
            child: RichText(
                text: TextSpan(
                    text: '目前选中了',
                    style: TextStyle(color: Colors.black),
                    children: [
                  TextSpan(
                    text: text,
                    style: TextStyle(color: Colors.red),
                  ),
                  TextSpan(text: '页面')
                ])),
          ),
        ),
        bottomNavigationBar: getNavBars());
  }
}
